<template>
  <div class="main-content">
    <!-- tab展示内容 -->
        <!-- <my-tabs :tabArr="store.state.contentTabs"></my-tabs> -->
          <router-view v-slot="{ Component }">
            <keep-alive :exclude="['publishArticle','releaseNewsletter','productionDetail','releaseVideos','drafts','assessorDetail','assessorAuditedList','accountManagement']">
              <component :is="Component" />
            </keep-alive>
          </router-view>


  </div>
</template>
<script>
import { isURL } from '@/utils/validate'
import { nextTick } from 'vue'
import { useStore } from 'vuex'
import { useRouter } from 'vue-router'
import myTabs from '@/components/tabs/tabs'

export default {
  name: 'Main-content',
  setup () {
    const store = useStore()
    const router = useRouter()
    // 刷新当前页面
    const refresh = () => {
      store.state.contentIsNeedRefresh = true
      nextTick(() => {
        store.state.contentIsNeedRefresh = false
      })
    }
    // tabs, 是否通过iframe展示
    const tabIsIframe = (url) => {
      return isURL(url)
    }
    // tabs, 选中tab
    const tabSelectedHandle = (tab) => {
      tab = store.state.contentTabs.filter(item => item.name === tab.props.name)[0]
      if (tab) {
        router.push({
          name: tab.name,
          params: { ...tab.params },
          query: { ...tab.query }
        })
      }
    }
    // tabs, 删除tab
    const tabRemoveHandle = (tabName) => {
      if (tabName === 'home') {
        return false
      }
      store.state.contentTabs = store.state.contentTabs.filter(item => item.name !== tabName)
      if (store.state.contentTabs.length <= 0) {
        store.state.sidebarMenuActiveName = store.state.contentTabsActiveName = 'home'
        return false
      }
      // 当前选中tab被删除
      if (tabName === store.state.contentTabsActiveName) {
        router.push({ name: store.state.contentTabs[store.state.contentTabs.length - 1].name })
      }
    }
    // tabs, 关闭其它
    const tabsCloseOtherHandle = () => {
      store.state.contentTabs = store.state.contentTabs.filter(item => {
        return item.name === 'home' || item.name === store.state.contentTabsActiveName
      })
    }
    // tabs, 关闭全部
    const tabsCloseAllHandle = () => {
      store.state.contentTabs = store.state.contentTabs.filter(item => item.name === 'home')
      router.push({ name: 'home' })
    }

    return {
      refresh,
      tabIsIframe,
      tabSelectedHandle,
      tabRemoveHandle,
      tabsCloseOtherHandle,
      tabsCloseAllHandle,
      store,
    }
  },
  components:{
    // myTabs
  }
}
</script>
